{extend name="layouts@base" /}
{block name="head"}
<link rel="stylesheet" href="__STATIC__/mobile/default/css/userData.css" />
<style>
    .van-nav-bar__title{
        height: 46px;
        line-height: 46px;
    }
    .yellow{
        /*color: #eccc2f;*/
        font-weight: bold;
        font-size:15px;
    }
    .allPrice{
        text-align: right;
        font-weight: bold;
        font-size: 16px;
    }
</style>
{/block}
{block name="main" }
<div id="app" class="page-bd userData">
    <!-- 页面内容-->
    <!-- <van-search v-model="value" placeholder="请输入搜索关键词" show-action @clear="onSearch">
      <template #action>
        <van-button type="primary" size="small" @click="onSearch">搜索</van-button>
      </template>
    </van-search> -->
    <div style="margin-top: 10px">
        <van-cell v-for="item in memberList" :key="item.user_id" center>
          <template #title>
            <div style="display: flex; align-items: center;justify-content: space-between;">
                <!-- <van-image round width="40px" height="40px" :src="item.avatar"></van-image> -->
                <div style="margin-left: 10px">
                    <p class="yellow">订单编号：{{item.order_sn}}</p>
                    <p class="yellow">下级昵称：{{item.buy_name}}</p>
                    <p style="font-size:10px"class="yellow">{{item.add_time}}</p>
                </div>
                <section class="allPrice">
                  <span style="font-size:10px"></span>+{{item.dividend_amount}}元
                </section>
            </div>
          </template>
          <template #label>
            <!--<div style="display: flex; align-items: center;">-->
            <!--    <van-icon name="location-o" size="12"></van-icon>-->
            <!--    <span style="margin-left: 5px;">{{item.region_name}}</span>-->
            <!--</div>-->
            <!--<div style="display: flex; align-items: center;">-->
            <!--    <van-icon name="phone-o" size="12"></van-icon>-->
            <!--    <span style="margin-left: 5px;">{{item.phone}}</span>-->
            <!--</div>-->
            <!--<div style="display: flex; align-items: center;">-->
            <!--    <van-icon name="diamond-o" size="12"></van-icon>-->
            <!--    <span style="margin-left: 5px;">{{item.level}}</span>-->
            <!--</div>-->
          </template>
        </van-cell>
    </div>
</div>


{/block}

{block name="footer"}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.12/lib/index.css"/>
<script src="https://cdn.jsdelivr.net/npm/vant@2.12/lib/vant.min.js"></script>
<script type="text/javascript">
var app2 = new Vue({
  el: '#app',
  data: {
    value: '',
    memberList: []
  },
  mounted(){
    this.getList()
  },
  methods: {
    getList() {
        jq_ajax('{:url("member/api.center/regionaward")}',{cityname: this.value},(res)=>{
            this.memberList = res.data
        });   
    },
    onSearch(){
        this.getList()
    }
  }
})
</script>

{/block}